import React, {Component} from 'react'
import {connect} from 'react-redux'
import {Link} from 'react-router-dom'

import Header from "../components/header";
import {loadNewList} from "../redux/actions/findAction"

class NewsContainer extends Component {
  constructor (props){
   super(props)
   this.state= {}
}

componentDidMount(){
  const {dispatch} = this.props
  dispatch(loadNewList())
}
  
   render() {
    let newslist = this.props.find.get("news")
    console.log(newslist);
   return <div className="new">
         <Header title="新闻" {...this.props}></Header>
        <div className="newbody">
          <ul>
            {
              newslist.length !== 0 &&  
              newslist.map((item,index)=>{
                return             <li key={index}>
                <Link to={"news/"+item.id}>
                <img src="" alt=""/>
                <h3>{item.title}</h3>
                <p>{item.source}</p>
                </Link>
              </li>
              })
            }

          </ul>

        </div>

   </div>
   }
}

function mapStateToProps(state) {
  return {
    find: state.find
  }
}

export default connect(mapStateToProps)(NewsContainer)